/**
 * 动作信息
 */
import React, { Component } from 'react';
import { message, Modal } from 'antd';
import * as Request from '../../../Server/Upgrade';
import * as Constant from '../../../common/const';
import DetailTable from './DetailTable';
import ActionsFrom from './ActionsFrom';
import qs from 'qs';
import {AuthButton,AuthA} from '../../auth/OperationAuth';

const confirm = Modal.confirm;
const defaultPage = { page: Constant.DEFAULT_PAGE, size: Constant.DEFAULT_PAGE_SIZE };
let id = '';
let permissions = undefined;

class ActionsTable extends Component{
    constructor(props) {
        super(props);
        const { params } = this.props.match;
        id = params.id;
        this.state = {
            loading: false, //表格加载样式
            data: [], //表格数据
            pagination: {},
            row: {}, //修改的单条记录
            flag: false //修改页面显示状态
        };
        permissions = JSON.parse(localStorage.getItem('user')).permission;
    }

    componentWillMount() {
        this.getTableData({...defaultPage, vId: id});
    }

    //查询表格数据方法
    getTableData = (param) =>{
        const { pagination } = this.state;
        this.setState({ loading: true });
        const _param = qs.stringify(param);
        Request.getActions(_param).then(res => {
            if(res && res.code == Constant.REQUEST_SUCCESS){
                const data = res.data;
                this.setState({
                    data: data.content,
                    loading: false,
                    pagination: Object.assign(pagination, { total: data.totalSize, current: data.page + 1, pageSize: data.size }),
                });
            }else{
                this.setState({ loading: false});
                res.code !== Constant.REQUEST_UNAUTHORIZED && message.error(res.msg);
            }
        });
    }

    //删除方法
    deleteFunc = (row) => {
        const param = {
            id: row.id
        };
        const _param = qs.stringify(param);
        confirm({
            title: '确定要删除该条信息？',
            maskClosable: true,
            okText: "确定",
            cancelText: "取消",
            onOk: () => this.onOkFunc(_param),
            onCancel() { },
        });
    }
    //删除确认方法
    onOkFunc = (_param) => {
        Request.actionsDelete(_param).then(res => {
            if (res && res.code == Constant.REQUEST_SUCCESS) {
                this.getTableData(this.getPageParams(true));
                message.success('删除成功！', 1);
            } else {
                res.code !== Constant.REQUEST_UNAUTHORIZED && message.error(res.msg, 2)
            }
        });
    }

    getPageParams = (isDelete) => {
        const { pagination } = this.state;
        const params = {
            page: pagination.current -1 ,//后台分页默认从第0页开始
            size: pagination.pageSize || Constant.DEFAULT_PAGE_SIZE,
            vId: id
        };
        if(isDelete && pagination.current == Math.ceil(pagination.total/pagination.pageSize)
            && pagination.total%pagination.pageSize == 1){
            params.page > 0 && params.page --;
        }
        return params;
    }

    //新增/修改方法
    showModelFunc = (row, flag) =>{
        this.setState({
            row: row,
            flag: flag
        })
    }

    /* 翻页 */
    handleTableChange = (pagination) => {
        const pager = { ...this.state.pagination };
        pager.current = pagination.current;
        pager.pageSize = pagination.pageSize;
        this.setState({
            pagination: pager
        });
        this.getTableData({
            page: pagination.current - 1,//后台分页默认从第0页开始
            size: pagination.pageSize,
            vId: id
        });
    }

    currentPageSize = () => this.state.pagination.pageSize || Constant.DEFAULT_PAGE_SIZE;

    render(){
        const { data, loading, row, flag, pagination } = this.state;
        const { params } = this.props.match;
        let rowState = permissions.includes('version:save') || permissions.includes('version:delete');

        const columns = [
            {
                title: "主键",
                dataIndex: "id",
                align: 'center',
                width: '4%'
            }, {
                title: "动作名称",
                dataIndex: "idMain",
                align: 'center',
                width: '9%',
            }, {
                title: "索引",
                dataIndex: "index",
                align: 'center',
                width: '4%',
            }, {
                title: "状态判断",
                dataIndex: "ifstatus",
                align: 'center',
                width: '8%',
            }, {
                title: "动作判断",
                dataIndex: "ifactions",
                align: 'center',
                width: '6%'
            // }, {
            //     title: "区域编码",
            //     dataIndex: "ifarea",
            //     align: 'center',
            //     width: '6%'
            }, {
                title: "执行判断",
                dataIndex: "executeif",
                align: 'center',
                width: '10%'
            }, {
                title: "合并到动作",
                dataIndex: "mergetoaction",
                align: 'center',
                width: '7%'
            }, {
                title: "参数",
                dataIndex: "params",
                align: 'center',
                width: '20%'
            }, {
                title: "版本信息ID",
                dataIndex: "versionId",
                align: 'center',
                width: '8%',
            }, {
                title: "备注",
                dataIndex: "remark",
                align: 'center',
                width: '12%',
                colSpan: rowState ? 1 : 2,
                render: (text, record) => {
                    if (rowState) {
                        return text
                    }
                    const obj = {
                            children: text,
                            props: {},
                        }
                    ;
                    obj.props.colSpan = 2;
                    return obj;
                }
            }, {
                title: "操作",
                align: 'center',
                width: '13%',
                colSpan: rowState ? 1 : 0,
                render: (text, record) => {
                    if (rowState) {
                        return <span>
                            <AuthA className='operation-primary' permission={'version:save'} onClick={()=>this.showModelFunc(record, true)}>编辑</AuthA>
                            <AuthA className='operation-danger' permission={'version:delete'} onClick={() => this.deleteFunc(record)}>删除</AuthA>
                        </span>
                    }
                    const obj = {
                        children: <span></span>,
                        props: {},
                    };
                    obj.props.colSpan = 0;
                    return obj;
                }
            }
        ];

        return(
            <div>
                {flag&&<ActionsFrom
                    id={id}
                    row={row}
                    showModelFunc={this.showModelFunc}
                    getTableData={this.getTableData}
                    current={pagination.current}
                    size={this.currentPageSize}
                />}
                <DetailTable
                    columns={columns}
                    title={'动作信息'} 
                    addFunc={this.showModelFunc} 
                    id={id}
                    getTableFunc={this.getTableData}
                    data={data}
                    loading={loading}
                    defaultKey="actions"
                    pushFunc={this.props.history.push}
                    handleTableChange={this.handleTableChange}
                    pagination={pagination}
                />
            </div>
        )
    }
}

export default ActionsTable